<template>
    <div class="room">
        <h2>管理员列表</h2>
        <div class="header">
        <span class="key">关键字</span>
        <el-input v-model="formline.key" placeholder="关键字" style="width:200px;margin-right:60px;"></el-input>
        <el-button type="primary" @click="adminslist()">查询</el-button>
        </div>

<center ></center>

    <Pagination
      :pageSize="formline.psize"
      :total="total"
      @changePage="getRoleList"
    />
    </div>
</template>
<script>
import _ from "lodash";
import Pagination from "../common/pages/Page1.vue";
import center from '../../views/Adminfee.vue'
import { adminlist ,admindelete,administratorrolelist,adminadd,adminalter} from "../../api/user.js";
var token = sessionStorage.getItem("token");
export default {
   components:{
    Pagination,
    center
  },
    data() {
      return {
         myHeaders: { Authorization: token },
     formline: {
          page: 1,
          psize:5,
          total:0,
      },
      total:0,
      value: [],
      query:{},
       multipleSelection: [],
      centerDialogVisible: false,
      administratorrolelist:[],
      list: [],
      adminlist: [],
      ruleForm:[],
      key: "",
      dialogVisible: false,
      dialogVisibles:false,
      input: '',
      xiugai: false,
        updata: [
					{
				    id: 0,
            username: "",
            pass: "",
            name: "",
            tel: "",
            typeid: '',
					},
				],
        addForm: {
          id:'',
          username: '',
          pass: '',
          name: '',
          tel: '',
          typeid:'',
        },
        rules: {
          username: [
            { required: true, message: '请输入账号', trigger: 'blur' },
            { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }
          ],
          pass: [
            { required: true, message: '请输入密码', trigger: 'blur' },
            { min: 2, max: 12, message: '长度在 2 到 12 个字符', trigger: 'blur' }
          ],
          name: [
            { required: true, message: '请输入姓名', trigger: 'blur' },
            { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }
          ],
          tel: [
            { required: true, message: '请填写练习方式', trigger: 'blur' },
            { min: 11, max:11, message: '请输入正确的号码', trigger: 'blur' }
          ],
        },
        multipleSelection: []
      };
    },
    methods: {
      update(option) {
				console.log(option);
				this.updata = option;
				this.xiugai = true;
				// this.amend()
				},

				async amend() {
				let res = await adminalter({
					id: this.updata.id,
					username: this.updata.username,
					name: this.updata.name,
					pass:this.updata.pass,
					tel: this.updata.tel,
					typeid: this.updata.typeid,
				});
				if (res.errCode == "10000") {
					this.$message({
					type: "success",
					message: "修改成功",
					});
					this.xiugai = false;
					this.adminslist();
				}
				},
      async submitaddform() {
        const edituser = sessionStorage.getItem("name")
        const params = {
           id: 0,
           username: this.addForm.username,
           pass:this.addForm.pass,
           name:this.addForm.name,
           tel:this.addForm.tel,
           typeid:this.addForm.typeid
        }
        console.log(params);
        let res = await adminadd(params)
        if(res.errCode === 10000){
          this.dialogVisible = false
          this.adminslist()
          this.$refs['form'].adminslist()
        }
    },
    async administratorroleslist(){
      const res = await administratorrolelist()
      this.administratorrolelist= res.data.list
      console.log(res);
    },
      async adminslist() {
      const res = await adminlist({
        page:this.formline.page,
        psize:this.formline.psize,
        key: this.formline.key,
      })
      this.adminlist = res.data.list

      this.formline.total= res.data.counts
    },

    del(id) {
      this.$confirm("此操作将永久删除该文件, 是否继续?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
           admindelete({id:id}).then((res) => {
            console.log(res);
            if (res.errCode == 10000) {
              this.adminslist();
            }
          });
          this.$message({
            type: "success",
            message: "删除成功!",
          });
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消删除",
          });
        });
    },
      handleClose(done) {
        this.$confirm('确认关闭？')
          .then(_ => {
            done();
          })
          .catch(_ => {});
      },
    
       handleSelectionChange(val) {
      this.multipleSelection = [];
      for(let selectedItem of val){
        this.multipleSelection.push(selectedItem.id)
      }
    },
    resetForm(formName) {
        this.$refs[formName].resetFields();
      },
      async getRoleList (params) {
        console.log(params)
        const { data } = await adminlist(Object.assign(this.formline, params))
        this.adminslist  = data.list
        this.loading = false
        this.total = data.counts
  },
  handleSizeChange (val) {
      this.formline.psize = val
      this.getRoleList()
    },
    handleCurrentChange (val) {
      this.formline.page = val
       this.getRoleList()
    },
     },
      mounted() {
      this.adminslist();
      this.administratorroleslist()
      this.getRoleList()
  },
  };
</script>
<style lang="less" scoped>
    h2{
        color:rgb(93, 145, 245);
        margin: 0 40px;
        border-bottom: 1px solid #999;
        line-height: 90px;
        margin-bottom:30px;
    }
    .key{
        margin-left:50px;
        margin-right:20px;
    }
    .add{
        margin-left:50px;
        margin-top:20px;
        margin-bottom:20px;
    }
    .el-input{
        width:60%;
    }
    .block{
		  text-align: center;
		  margin-top: 20px;
	  }
</style>